<template>
  <div id="addAccounts">
    <!-- 基础信息 -->
   <div class="addItem" v-show="active == 0">
    <h3>开户信息</h3>
    <el-form :label-position="labelPosition" label-width="80px" :model="accounts">
      <el-form-item label="证件号码">
        <el-input v-model="accounts.certificateNumber"></el-input>
      </el-form-item>
      <el-form-item label="卡号">
        <el-input v-model="accounts.passbookNumber"></el-input>
      </el-form-item>
      <el-form-item label="开户金额">
        <el-input v-model="accounts.registerCapital"></el-input>
      </el-form-item>
      <el-form-item label="电话">
        <el-input v-model="accounts.tel"></el-input>
      </el-form-item>
      <el-form-item label="密码">
        <el-input v-model="accounts.password"></el-input>
      </el-form-item>
      <el-button type="primary" :plain="true" @click="addAccounts">提交</el-button>
    </el-form>
   </div>
  </div>
</template>

<script>
import apis from '../../../http/apis/apis'
export default {
  data() {
    return {
      active: 0,
      labelPosition: 'right',
      accounts: {
        certificateNumber: '',        //证件号码
        passbookNumber: '',          //卡号
        registerCapital: '',          //开户金额
        password: '',         //密码
        tel: '',   //电话
      },
    };
  },
  methods: {
    async addAccounts() {
      const {data} = await apis.accounts.addAccounts(this.accounts)
      if(data.status) {
        this.addAccountsFlows()
        this.addSuccess()
      }
    },
    // 新增个人客户流水
    async addAccountsFlows() {
      const {data} = await apis.accounts.addAccountFlows({type: '个人开户',organization: '个人', registerCapital: this.accounts.registerCapital, time: new Date().toLocaleString()})
      if(data.status) {
        alert('流水新增成功')
      }
    },
    addSuccess() {
      this.$message({
        message: '添加成功',
        type: 'success'
      });
    },
  }
  
}
</script>

<style lang="scss">

  #addAccounts {
    .addItem {
      width: 600px;
      padding: 10px 120px;
      box-shadow: 1px 1px 30px #ccc;
      background-color: #fff;
      margin: 30px auto;
      border-radius: 8px;
      h3 {
        text-align: center;
      }
      
    }
    .el-button {
      margin-left: 250px
    }
  }
</style>